{include file="public/header" /}
<body class="gray-bg">
<div class="wrapper wrapper-content animated fadeInRight">
    <!-- Panel Other -->
    <div class="ibox float-e-margins">
        <div class="ibox-title">
            <h5>会员列表</h5>
        </div>
        <div class="ibox-content">
            <!--搜索框开始-->
            <div class="row">
                <div class="col-sm-11">
                    <form class="layui-form" action="">
                        <div class="col-sm-3">
                            <div class="input-group">
                                <input type="text" id="key" class="form-control" name="name" value=""
                                       placeholder="输入需查询的用户名" style="width: 250px;"/>
                                <span class="input-group-btn">
                                    <button type="submit" class="btn btn-primary" lay-submit lay-filter="search">
                                        <i class="fa fa-search"></i> 搜索
                                    </button>
                                </span>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
            <!--搜索框结束-->
            <div class="example-wrap">
                <div class="example">
                    <table lay-filter="demo">
                        <thead>
                        <tr>
                            <th lay-data="{field:'id', width:100}">id</th>
                            <th lay-data="{field:'name', width:80, sort:true}">用户名</th>
                            <th lay-data="{field:'nickname'}">昵称</th>
                            <th lay-data="{field:'sex'}">性别</th>
                            <th lay-data="{field:'city'}">居住城市</th>
                            <th lay-data="{field:'action'}">操作</th>
                        </tr>
                        </thead>
                        <tbody>
                        {if condition="$member"}
                            {foreach $member as $v}
                                <tr>
                                    <td>{$v.id}</td>
                                    <td>{$v.name}</td>
                                    <td>{$v.nickname}</td>
                                    <td>{$v.sex}</td>
                                    <td>{$v.city}</td>
                                    <td>
                                        <button data-id="{$v.id}" class="layui-btn layui-btn-xs member-show">查看详情</button>
                                        <button data-id="{$v.id}" class="layui-btn layui-btn-xs edit">编辑</button>
                                        <button data-id="{$v.id}" class="layui-btn layui-btn-xs member-del">删除</button>
                                    </td>
                                </tr>
                            {/foreach}
                        {/if}
                        </tbody>
                    </table>
                    {if condition='$member'}
                        {$member->render()}
                    {/if}

                </div>
            </div>
            <!-- End Example Pagination -->
        </div>
    </div>
</div>
<!-- End Panel Other -->
</div>
<div style="display: none" id="show">
    <div class="layui-form-item">
        <label class="layui-form">用户名：</label>
        <label class="layui-form name"></label>
    </div>
    <div class="layui-form-item">
        <label class="layui-form">昵称：</label>
        <label class="layui-form nickname"></label>
    </div>
    <div class="layui-form-item">
        <label class="layui-form">性别：</label>
        <label class="layui-form sex"></label>
    </div>
    <div class="layui-form-item">
        <label class="layui-form">生日：</label>
        <label class="layui-form birthday"></label>
    </div>
    <div class="layui-form-item">
        <label class="layui-forml">居住城市：</label>
        <label class="layui-form- city"></label>
    </div>
    <div class="layui-form-item">
        <label class="layui-form">手机：</label>
        <label class="layui-form phone"></label>
    </div>
    <div class="layui-form-item">
        <label class="layui-form">邮箱：</label>
        <label class="layui-form email"></label>
    </div>
</div>
{include file="public/footer" /}
<script>
    var table = layui.table;
    //转换静态表格
    table.init('demo', {
        height: 315 //设置高度
        ,limit: 10 //注意：请务必确保 limit 参数（默认：10）是与你服务端限定的数据条数一致
        //支持所有基础参数
    });
    //删除
    $('.member-del').click(function () {
        //获取用户id
        var obj = $(this);
        var id = $(this).attr('data-id');
        layer.confirm('是否确认删除该用户？', {
            btn: ['确定','取消'] //按钮
        }, function(){
            $.post('/admin/member/del',{id:id},function (data) {
                console.log(data);
                if(data.code==200){
                    layer.msg('已删除', {icon: 1});
                    $(obj).parent().parent().parent().remove();
                }else {
                    layer.msg(data.msg, {icon: 2});
                }
            },'json');

        }, function(){

        });
    });
    //查看详情
    $('.member-show').click(function () {
        var id = $(this).attr('data-id');
        //获取用户的资料
        $.post('/admin/member/get_member',{id:id},function (data) {
            console.log(data);
            if(data.code == 200) {
                $('.name').html(data.data.name);
                $('.nickname').html(data.data.nickname);
                $('.sex').html(data.data.sex);
                $('.birthday').html(data.data.birthday);
                $('.city').html(data.data.city);
                $('.phone').html(data.data.phone);
                $('.email').html(data.data.email);
                show_tpl();
            }else {
                layer.msg(data.msg, {icon: 2});
            }


        },'json');

    });
    //查看详情弹出层
    function show_tpl() {
        layer.open({
            type: 1,
            title:'用户详情',
            closeBtn: false,
            btn: ['关闭'],
            skin: 'layui-layer-rim', //加上边框
            area: ['420px', '420px'], //宽高
            content: $('#show'),
            end: function () {
                $('#show').css('display','none');
            }
        });
    }
    //编辑
    $('.edit').click(function () {
        var id= $(this).attr('data-id');
        location.href = "/admin/member/edit?id="+id;
    });
</script>


</body>
</html>